import React, { Component } from 'react';

import { routerRedux, Route, Switch } from 'dva/router';


import Debounce from 'lodash-decorators/debounce';
import Bind from 'lodash-decorators/bind';
import { connect } from 'dva';
import {
  Button, Menu, Dropdown, Icon, Row, Col,
  Input, InputNumber,
  Steps, Card, Popover, Badge, Table, Tooltip, Divider,
  Checkbox, Modal, Radio,
  Select, message

} from 'antd';
import { getRoutes } from '../../utils/utils';
import classNames from 'classnames';
import PageHeaderLayout from '../../layouts/PageHeaderLayout';
import DescriptionList from '../../components/DescriptionList';
import styles from './ApplyProfile.less';
import u620 from '../../assets/u620.png';
import u622 from '../../assets/u622.png';
import yes from '../../assets/yes.png';
import no from '../../assets/no.png';
import querystring from 'querystring';
export let profileState6 = false;
const { Step } = Steps;
const TextArea = Input.TextArea;
const { Description } = DescriptionList;
const ButtonGroup = Button.Group;
const RadioGroup = Radio.Group;
const Option = Select.Option;

const getWindowWidth = () => (window.innerWidth || document.documentElement.clientWidth);

@connect(({ pendingTask, }) => ({
  pendingTask,
}))
export default class CompleteApplyDetails6 extends Component {
  state = {
    id: '',
    taskId: '',
    operationkey: 'tab1',
    stepDirection: 'horizontal',
    modalVisible: false,
    profileState6: false,
    result: '',
    amount: '',
    note: '',
    history: {},
    historyNoteOne: '',
    historyNoteTwo: '',
    custList: {},
    auditList: {},
    auditOpinionList: {}
  }

  componentDidMount() {
    const { dispatch, location } = this.props;
    const params = querystring.parse(location.search.slice(1));

    this.setState({
      id: params.custId,
      taskId: params.taskId,
      reviewState: params.reviewState,
    })
    if (params.custId != null) {
      dispatch({
        type: 'pendingTask/auditOpinion',
        payload: {
          id: params.custId,
        },
        callback: () => {
          const { pendingTask: { auditOpinionList } } = this.props;
          console.log("auditOpinionList",auditOpinionList)
          this.setState({
            auditOpinionList: auditOpinionList.audit,
            history: auditOpinionList.history,
            amount: auditOpinionList.audit.amount,
            note: auditOpinionList.audit.note,
          })
          auditOpinionList.history[0] &&
            this.setState({
              historyNoteOne: auditOpinionList.history[0].note,
            })
          auditOpinionList.history[1] &&
            this.setState({
              historyNoteTwo: auditOpinionList.history[1].note,
            })
        }
      });
    }
    dispatch({
      type: 'pendingTask/fetchApplyProfile',
      payload: {
        id: params.id,
        // id: 1,
      },
      callback: () => {
        const { pendingTask: { custMessgeList, custAuditList } } = this.props;

        this.setState({
          custList: custMessgeList,
          auditList: custAuditList
        })
      }
    });
    this.setStepDirection();
    window.addEventListener('resize', this.setStepDirection);
  }

  // componentWillUnmount() {
  //   window.removeEventListener('resize', this.setStepDirection);
  //   this.setStepDirection.cancel();
  // }

  @Bind()
  @Debounce(200)
  setStepDirection() {
    const { stepDirection } = this.state;
    const w = getWindowWidth();
    if (stepDirection !== 'vertical' && w <= 576) {
      this.setState({
        stepDirection: 'vertical',
      });
    } else if (stepDirection !== 'horizontal' && w > 576) {
      this.setState({
        stepDirection: 'horizontal',
      });
    }
  }

  render() {
    const { stepDirection } = this.state;
    const { pendingTask: { auditOpinionList } } = this.props;
    const img = (<img alt="" src={u620} />);
    return (
      <Row>
        <Row>
          <Col span={21}>
            <Card title="调查意见"
              bordered={false}>
              <span>
                我行贷前调查人员已按信贷管理的有关规定，
                履行了贷前尽职调查的责任与义务，
                并对所提供贷款资料的真实性、完整性、准确性负责，无其他应报未报事项。
                申请人提交与填写申请资料属实，资信正常，
                具备按时足额还款能力，抵(质)押物与保证担保足值合法有效。
              </span>
              <span>
                我行同意申请人
                <Input
                  style={{ width: 100, marginLeft: 6, marginRight: 6, marginTop: 10 }}
                  value={this.state.custList.custName}
                />
                办理
                <InputNumber style={{ width: 100, marginLeft: 6, marginRight: 6 }} value={this.state.custList.loanAmount} />
                元汽车专项分期付款，
                申请期限
                <InputNumber style={{ width: 100, marginLeft: 6, marginRight: 6 }} value={this.state.custList.duration} />月，
                手续费率
                <InputNumber style={{ width: 100, marginLeft: 6, marginRight: 6 }} value={this.state.custList.feeRate} />
                %。
              </span>
              <span>
                <Row style={{ marginTop: 30 }}>
                  同意其分期付款卡临时调升至人民币
                  <InputNumber
                    style={{ width: 100, marginLeft: 6, marginRight: 6, marginTop: 5 }}
                    value={this.state.amount}
                  />
                  元整。
                </Row>
              </span>
              {
                this.state.historyNoteOne == "" ? null :
                  <Row style={{ marginTop: 30 }}>
                    一审意见: {this.state.historyNoteOne}
                  </Row>
              }
              {
                this.state.historyNoteTwo == "" ? null :
                  <Row style={{ marginTop: 30 }}>
                    二审意见: {this.state.historyNoteTwo}
                  </Row>
              }

            </Card>
          </Col>
        </Row>

      </Row>
    );
  }
}
